<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="s" uri="http://www.springframework.org/tags/form" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head>
    <title>java在线网盘系統-登录</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="keywords"
          content="Eminent Login Form Widget Responsive, Login form web template,Flat Pricing tables,Flat Drop downs  Sign up Web Templates, Flat Web Templates, Login signup Responsive web template, Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design"/>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <link href="css/style.css" rel='stylesheet' type='text/css' media="all"/>
</head>
<body style="background: url(static/loginbg.jpg);">
<script type="text/javascript">
    var sysMsg = "${sysMsg}"
    if (sysMsg != "")
        alert(sysMsg);
</script>
<h1>java在线网盘系統</h1>
<div class="form-w3ls" style="background-color: rgba(203,223,235,0.54)">
    <ul class="tab-group cl-effect-4">
        <li class="tab active"><a href="#signin-agile">登录</a></li>
        <li class="tab"><a href="#signup-agile">注册</a></li>
    </ul>
    <div class="tab-content">
        <div id="signin-agile">
            <form action="login" method="post">
                <p class="header">用户名</p>
                <input type="text" name="username" value="admin" onfocus="this.value = '';"
                       onblur="if (this.value == '') {this.value = '';}">
                <p class="header">密码</p>
                <input type="password" name="password" value="123456" onfocus="this.value = '';"
                       onblur="if (this.value == '') {this.value = '';}">
                <input type="submit" class="sign-in" value="登录">
            </form>
        </div>
        <div id="signup-agile">
            <form action="register" method="post">

                <p class="header">用户名(登录名)</p>
                <input id="username" type="text" name="username" value="" onblur="checkUsername()">

                <p class="header">身份证</p>
                <input id="idcard" type="text" name="idcard" maxlength="18" value="" onblur="checkIdcard()">


                <p class="header">邮箱</p>
                <input id="email" type="text" name="email" value="" onfocus="this.value = '';"
                       onblur="if (this.value == '') {this.value = '';}">


                <p class="header">密码</p>
                <input id="password" type="password" name="password" value="" onfocus="this.value = '';"
                       onblur="if (this.value == '') {this.value = '';}">

                <p class="header">确认密码</p>
                <input id="rePassword" type="password" name="rePassword" value="" onfocus="this.value = '';"
                       onblur="if (this.value == '') {this.value = '';}">

                <input type="submit" class="register" value="注册"/>
            </form>
        </div>
    </div>
</div>
<p class="copyright">java在线网盘系統</p>
<script src='js/jquery.min.js'></script>
<script src="js/index.js"></script>
<script type="text/javascript">

    function checkUsername() {
        var username = $("#username").val();
        $.post("${ctx}/checkUsername", {"username": username}, function (data) {
            //返回的JSON数据
            if (data == 1) {
                alert("用户名已经被占用");
                $("#username").val("");
                $("#username").focus();
            } else {

            }
        }, "json")
    }

    function checkIdcard() {
        var idcard = $("#idcard").val();
        $.post("${ctx}/checkIdcard", {"idcard": idcard}, function (data) {
            //返回的JSON数据
            if (data == 1) {
                alert("身份证已经被注册，请更换");
                $("#idcard").val("");
                $("#idcard").focus();
            } else {

            }
        }, "json")
    }

</script>
</body>
</html>
